<template>
 <div class="log-management">
    <h2>日志管理</h2>
    <el-table 
      v-loading="loading"
      :data="logList" 
      border 
      style="width: 100%"
    >
      <el-table-column prop="visitorip" label="访问IP"></el-table-column>
      <el-table-column prop="visitortime" label="访问时间"></el-table-column>
      <el-table-column prop="visitorclass" label="访问类"></el-table-column>
      <el-table-column prop="visitormethod" label="访问方法"></el-table-column>
    </el-table>
  </div>
</template>

<script>
import { getLogList } from '@/api/log' // 导入封装好的接口方法

export default {
  data() {
    return {
      logList: [],
      loading: false
    }
  },
  mounted() {
    this.fetchLogs()
  },
  methods: {
    async fetchLogs() {
      try {
        this.loading = true
        const response = await getLogList()
        this.logList = response.data
        
        // 如果需要处理时间格式（假设后端返回时间戳）
        this.logList = response.data.map(item => ({
          ...item,
          visitortime: this.formatTime(item.visitortime)
        }))
      } catch (error) {
        // console.error('获取日志:', error)
        // this.$message.error('获取日志信息')
      } finally {
        this.loading = false
      }
    },
    formatTime(timestamp) {
      // 使用dayjs或其他日期库格式化时间
      return dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss')
    }
  }
}
</script>

<style>

</style>